<template>
  <div class="selectlink">
    <!-- 选择类型 -->
    <div class="select-type">
      <!-- 输入链接 -->
      <el-input
        v-model="linkUrl"
        style="width: 100%"
        size="mini"
        placeholder="请输入链接或接口地址"
        @change="inputChange"
        clearable
      />
      <el-button size="mini" @click="dialogVisible = true">选择链接</el-button>
    </div>
    <el-button style="margin-top:6px;" size="mini" @click="clearLink">清除链接</el-button>

    <!-- 链接弹窗 -->
    <el-dialog title="选择链接" :visible.sync="dialogVisible" width="70%" center>
      <div class="linkcate">
        <el-tabs :tab-position="tabPosition" v-model="activeName" @tab-click="handleClick">
          <el-tab-pane :label="item.name" :name="item.id" v-for="item in tabsList" :key="item.id">
            <!-- 业务链接 -->
            <div v-show="item.id == 'app_business_link'">
              <el-table :data="linkData" style="width: 100%; margin-bottom: 20px">
                <el-table-column prop="id" label="ID"> </el-table-column>
                <el-table-column prop="name" label="名称"> </el-table-column>
                <el-table-column prop="url" label="链接地址"> </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="selectThisLink(scope.row)">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                :page-size="linkformdata.pageSize"
                :current-page="linkformdata.pageNum"
                @current-change="SetPage">
              </el-pagination>
            </div>
            <!-- 自定义页面 -->
            <div v-show="item.id == 'template_page_link'">
              <div class="headerboxLeft">
                <el-form ref="filterForm" v-model="filterForm" inline>
                  <el-form-item label="页面类型">
                    <el-select v-model="typevalue" clearable placeholder="请选择">
                      <el-option
                        v-for="item in filterForm.pageTypeList"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="学段">
                    <el-select v-model="pageSectionValue" clearable placeholder="请选择学段">
                      <el-option
                        v-for="item in pageSectionList"
                        :key="item.code"
                        :label="item.name"
                        :value="item.tagId + '-' + item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="serchCusPage">搜索</el-button>
                  </el-form-item>
                </el-form>
              </div>
              <el-table :data="customPageList" style="width: 100%; margin-bottom: 20px">
                <el-table-column prop="id" label="ID"> </el-table-column>
                <el-table-column prop="name" label="页面名称"> </el-table-column>
                <el-table-column prop="aliasName" label="页面标识"> </el-table-column>
                <el-table-column prop="pageTypeName" label="页面类型"> </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <el-button
                      type="primary"
                      size="small"
                      @click="selectPageLink(scope.row)"
                      >选择</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                :page-size="pageFormData.pageSize"
                :current-page="pageFormData.pageNum"
                @current-change="SetcuPage">
              </el-pagination>
            </div>
            <!-- 学科产品 -->
            <div v-show="item.id == 'subject_product_link'">
              <div class="searchbox">
                <el-form ref="cataformdata" v-model="cataformdata" inline>
                  <el-form-item label="产品名称">
                    <el-input placeholder="请输入名称" v-model="cataformdata.name" class="input-with-select"></el-input>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="sectionValue" @change="changeSection" clearable placeholder="请选择学段">
                      <el-option
                        v-for="item in sectionList"
                        :key="item.id"
                        :label="item.tagEnumName"
                        :value="item.id + '-' + item.tagId + '-' + item.tagEnumCode">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="subjectValue" clearable placeholder="请选择科目">
                      <el-option
                        v-for="item in subjectList"
                        :key="item.id"
                        :label="item.tagEnumName"
                        :value="item.tagId + '-' + item.tagEnumCode">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="gradeValue" clearable placeholder="请选择年级">
                      <el-option
                        v-for="item in gradeList"
                        :key="item.code"
                        :label="item.name"
                        :value="item.tagId + '-' + item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="serchCatau">搜索</el-button>
                  </el-form-item>
                </el-form>
              </div>
              <el-table :data="catalogList" style="width: 100%; margin-bottom: 20px">
                <el-table-column prop="itemOrder" label="序号"></el-table-column>
                <el-table-column prop="name" label="名称"></el-table-column>
                <el-table-column label="学段">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.section" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.section }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="年级">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.grade" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.grade }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="科目">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.subject" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.subject }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="学期">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.volume" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.volume }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="家辅专项分类">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.stuappspecialist" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.stuappspecialist }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="selectCataLink(scope.row)">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                :page-size="cataformdata.pageSize"
                :current-page="cataformdata.pageNum"
                @current-change="xkcpSetPage">
              </el-pagination>
            </div>
            <!-- 专项课程 -->
            <div v-show="item.id == 'special_courses_link'">
              <div class="searchbox">
                <el-form ref="courseformdata" v-model="courseformdata" inline>
                  <el-form-item label="产品名称">
                    <el-input placeholder="请输入名称" v-model="courseformdata.name" class="input-with-select"></el-input>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="sectionValue" @change="changeSection" clearable placeholder="请选择学段">
                      <el-option
                        v-for="item in sectionList"
                        :key="item.id"
                        :label="item.tagEnumName"
                        :value="item.id + '-' + item.tagId + '-' + item.tagEnumCode">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="subjectValue" clearable placeholder="请选择科目">
                      <el-option
                        v-for="item in subjectList"
                        :key="item.id"
                        :label="item.tagEnumName"
                        :value="item.tagId + '-' + item.tagEnumCode">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="">
                    <el-select v-model="gradeValue" clearable placeholder="请选择年级">
                      <el-option
                        v-for="item in gradeList"
                        :key="item.code"
                        :label="item.name"
                        :value="item.tagId + '-' + item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="searchCourse">搜索</el-button>
                  </el-form-item>
                </el-form>
              </div>
              <el-table :data="courseList" style="width: 100%; margin-bottom: 20px">
                <el-table-column prop="itemOrder" label="序号"> </el-table-column>
                <el-table-column prop="name" label="课程名称"> </el-table-column>
                <el-table-column label="学段">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.section" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.section }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="年级">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.grade" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.grade }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="科目">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.subject" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.subject }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="学期">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.volume" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.volume }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column label="课程类型">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" :content="scope.row.coursetyle" placement="top">
                      <span style="white-space: nowrap">{{ scope.row.coursetyle }}</span>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column prop="1396297940598822" label="课程数量">
                </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="selectCourLink(scope.row)">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                :page-size="courseformdata.pageSize"
                :current-page="courseformdata.pageNum"
                @current-change="zxkcSetPage">
              </el-pagination>
            </div>
            <!-- 运营中心 -->
            <div v-show="item.id == 'operating_center_link'">
              <div class="searchbox">
                <el-form ref="adsformdata" v-model="adsformdata" inline>
                  <el-form-item label="位置名称">
                    <el-input placeholder="请输入名称" v-model="adsformdata.title" class="input-with-select"></el-input>
                  </el-form-item>
                  <el-form-item label="终端">
                    <el-select v-model="adsformdata.terminal" clearable placeholder="请选择">
                      <el-option
                        v-for="item in terminalList"
                        :key="item.value"
                        :label="item.name"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="serchTable">搜索</el-button>
                  </el-form-item>
                </el-form>
              </div>
              <el-table :data="adsList" style="width: 100%; margin-bottom: 20px">
                <el-table-column prop="title" label="名称"> </el-table-column>
                <el-table-column label="展示方式">
                  <template slot-scope="scope">
                    <span v-show="scope.row.showMode == 0">轮播图</span>
                    <span v-show="scope.row.showMode == 1">图文混排</span>
                  </template>
                </el-table-column>
                <el-table-column label="终端">
                  <template slot-scope="scope">
                    <span v-show="scope.row.terminal == 0">pc</span>
                    <span v-show="scope.row.terminal == 1">手机</span>
                    <span v-show="scope.row.terminal == 2">pad</span>
                    <span v-show="scope.row.terminal == 3">微信</span>
                    <span v-show="scope.row.terminal == 4">支付宝</span>
                    <span v-show="scope.row.terminal == 5">头条</span>
                    <span v-show="scope.row.terminal == 6">短信</span>
                    <span v-show="scope.row.terminal == 7">H5</span>
                  </template>
                </el-table-column>
                <el-table-column label="角色">
                  <template slot-scope="scope">
                    <span v-show="scope.row.roles == 0">学生/家长 </span>
                    <span v-show="scope.row.roles == 2">教师</span>
                  </template>
                </el-table-column>
                <el-table-column prop="remark" label="备注"> </el-table-column>
                <el-table-column label="操作">
                  <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="selectOperLink(scope.row)">选择</el-button>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                :page-size="adsformdata.pageSize"
                :current-page="adsformdata.currentPage"
                @current-change="adsSetPage">
              </el-pagination>
            </div>
            <!-- 书籍管理 -->
            <div v-show="item.id == 'book_link'">
              <div class="searchbox">
                <el-form ref="bookForm" v-model="bookForm" inline>
                  <el-form-item label="书籍分类">
                    <el-select v-model="bookForm.booktype" clearable placeholder="请选择">
                      <el-option
                        v-for="item in bookCateList"
                        :key="item.tagId + '-' + item.name"
                        :label="item.name"
                        :value="item.code">
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="书籍名称">
                    <el-input placeholder="请输入名称" v-model="bookForm.name" class="input-with-select"></el-input>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="serchBook">搜索</el-button>
                  </el-form-item>
                </el-form>
                <el-table :data="bookList" style="width: 100%; margin-bottom: 20px">
                  <el-table-column prop="id" label="ID"></el-table-column>
                  <el-table-column prop="name" label="书籍名称"></el-table-column>
                  <el-table-column prop="updateName" label="创建人"></el-table-column>
                  <el-table-column prop="updateTime" label="操作时间"></el-table-column>
                  <el-table-column label="操作">
                    <template slot-scope="scope">
                      <el-button type="primary" size="small" @click="selecBookLink(scope.row)">选择</el-button>
                    </template>
                  </el-table-column>
                </el-table>
                <el-pagination
                  background
                  layout="prev, pager, next"
                  :total="bookPager.total"
                  :page-size="bookPager.pageSize"
                  :current-page="bookPager.pageNum"
                  @current-change="bookSetPage">
                </el-pagination>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">关 闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  getTypeList,
  getLinkList,
  getPageList,
  getCataloguesList,
  getAdLocations,
  getTerminalList,
  getFirstLevels,
  getChildrenList,
  getSection,
  getTagDetail,
  getEntityBookList
} from "@/api/basisMG";
export default {
  props: {
    theIndex: {
      type: Number,
    },
    linktypeurl: {
      type: String,
    },
    sectionIndex: {
      type: Number,
    }
  },
  data() {
    return {
      dialogVisible: false,
      activeName: "first",
      tabPosition: "left",
      linkUrl: "",
      linkData: [], // 业务应用链接
      customPageList: [], // 自定义页面链接
      catalogList: [], //学科产品
      courseList: [], //专项课程
      adsList: [], // 推荐位列表
      formData: {
        type: 2,
        productType: "",
        pageSize: 10000,
        pageNum: 1,
      },
      typeformData: {
        type: 1,
        productType: "",
        pageNum: 1,
        pageSize: 50,
      },
      tabsList: [],
      linkformdata: {
        type: "",
        linkTypeId: "",
        pageNum: 1,
        pageSize: 10,
      },
      pageFormData: {
        appType: "",
        pageType: "",
        tags: "",
        pageNum: 1,
        pageSize: 10,
      },
      cataformdata: {
        pageNum: 1,
        pageSize: 10,
        endTime: "",
        name: "",
        startTime: "",
        level: 1,
        tags: "",
        type: 5,
      },
      courseformdata: {
        pageNum: 1,
        pageSize: 10,
        endTime: "",
        name: "",
        startTime: "",
        level: 1,
        tags: "",
        type: 3,
      },
      total: 0,
      adsformdata: {
        currentPage: 1,
        pageSize: 10,
        param: "",
        roles: "",
        terminal: "",
        title: "",
      },
      terminalList: [],
      sectionList: [], // 学段
      gradeList: [], // 年级
      subjectList: [], // 科目
      sectionValue: "",
      gradeValue: "",
      subjectValue: "",
      filterForm: {
        pageTypeList: [],
        section: [],
        pageNum: 1,
        pageSize: 10,
      },
      typevalue: "",
      pageSectionValue: "",
      pageSectionList: [],
      bookForm: {
        booktype: '', // 书籍分类
        name: '',
        grade: '',
        startTime: '',
        endTime: ''
      },
      bookPager: {
        pageNum: 1,
        pageSize: 10,
        total: 0
      },
      bookList: [],  // 书籍列表
      bookCateList: []  // 书籍分类
    };
  },
  methods: {
    // 业务链接分页
    SetPage(e) {
      this.linkformdata.pageNum = e;
      this.getLinkList();
    },
    // 自定义页面分页
    SetcuPage(e) {
      this.pageFormData.pageNum = e;
      this.getPageList();
    },
    // 学科产品分页
    xkcpSetPage(e) {
      this.cataformdata.pageNum = e;
      this.getCataloguesList();
    },
    // 专项课程分页
    zxkcSetPage(e) {
      this.courseformdata.pageNum = e;
      this.getCourseList();
    },
    // 运营位分页
    adsSetPage(e) {
      this.adsformdata.currentPage = e;
      this.getAdLocations();
    },
    // 书籍分页
    bookSetPage(e) {
      this.bookPager.pageNum = e;
      this.getBookList();
    },
    // 运营位搜索
    serchTable() {
      this.getAdLocations();
    },
    // 学科产品搜索
    serchCatau() {
      this.cataformdata.pageNum = 1;
      this.cataformdata.tags = this.sectionValue.slice(17, 29) + "," + this.gradeValue + "," + this.subjectValue;
      this.getCataloguesList();
    },
    // 专项课程搜索
    searchCourse() {
      this.courseformdata.tags = this.sectionValue.slice(17, 29) + "," + this.gradeValue + "," + this.subjectValue;
      this.getCourseList();
    },
    // 自定义页面搜索
    serchCusPage() {
      this.pageFormData.pageType = this.typevalue;
      this.pageFormData.tags = this.pageSectionValue;
      this.getPageList();
    },
    // 书籍搜索
    serchBook() {
      this.bookPager.pageNum = 1;
      this.getBookList();
    },
    handleClick(tab) {
      this.linkformdata.linkTypeId = tab.name;
      switch (tab.name) {
        case 'app_business_link':
          this.getLinkList();
          break;
        case 'template_page_link':
          this.getTypeList();
          this.getPageList();
          this.getSectionList();
          break;
        case 'subject_product_link':
          this.sectionValue = "";
          this.subjectValue = "";
          this.getCataloguesList();
          break;
        case 'special_courses_link':
          this.sectionValue = "";
          this.subjectValue = "";
          this.getCourseList();
          break;
        case 'operating_center_link':
          this.getAdLocations();
          break;
        case 'book_link':
          this.getTagDetail();
          this.getBookList();
          break;
      }
    },
    //获取页面类型
    async getTypeList() {
      const res = await getTypeList(this.typeformData);
      if (res.code === '200') {
        this.filterForm.pageTypeList = res.data.content;
      } else {
        this.filterForm.pageTypeList = [];
      }
    },
    // 获取链接类型
    async getLinkTypeList() {
      const res = await getTypeList(this.formData);
      if (res.code === '200') {
        this.tabsList = res.data.content;
        this.total = res.data.total;
      } else {
        this.tabsList = [];
        this.total = 0;
      } 
    },
    // 获取链接类型下的链接
    async getLinkList() {
      const res = await getLinkList(this.linkformdata);
      if (res.code === '200') {
        this.linkData = res.data.content;
        this.total = res.data.total;
      } else {
        this.linkData = [];
        this.total = 0;
      }
    },
    // 自定义页面学段
    async getSectionList() {
      const res = await getSection({ id: "section", codes: "" });
      this.pageSectionList = res.data.tagEnumVoList;
    },
    // 获取自定义页面列表
    async getPageList() {
      this.pageFormData.appType = JSON.parse(localStorage.getItem('apptype'))
      const res = await getPageList(this.pageFormData);
      if (res.data) {
        this.customPageList = res.data.content;
        this.total = res.data.total;
      } else {
        this.customPageList = [];
      }
    },
    // 获取学科产品列表
    async getCataloguesList() {
      const res = await getCataloguesList(this.cataformdata);
      let catalogArr = res.data.content;
      this.total = res.data.total;
      this.getFirstLevels();
      this.getGradeList();
      catalogArr.map((item) => {
        // 每条数据的 tag 数组
        let tagsData = item.tags;
        tagsData.map((tagItem) => {
          // 把标签数组里面的内容 赋值给 对象属性上
          let tagId = tagItem.tagId,
            enumName = tagItem.enumName || tagItem.enumCode;
          if (item[tagId] !== undefined) {
            item[tagId] = item[tagId] + " " + enumName;
          } else {
            item[tagId] = "" + enumName;
          }
          if (tagId === 'xtfl') {
            item['enumCode'] = tagItem.enumCode
          }
        });
      });
      this.catalogList = catalogArr;
    },
    // 获取学段
    async getFirstLevels() {
      const res = await getFirstLevels({ templateId: "1360833972011046" });
      this.sectionList = res.data;
      this.filterForm.tags = res.data;
    },
    changeSection(e) {
      this.getChildrenList();
    },
    // 获取某个学段下的科目
    async getChildrenList() {
      const res = await getChildrenList({
        levelIds: this.sectionValue.slice(0, 16),
        templateId: "1360833972011046",
      });
      this.subjectList = res.data;
    },
    // 获取年级
    async getGradeList() {
      const res = await getSection({ id: "grade", codes: "" });
      this.gradeList = res.data.tagEnumVoList;
    },
    // 获取书籍分类列表
    async getTagDetail() {
      const res = await getTagDetail({ id: "booktype" });
      if (res.code === '200') {
        this.bookCateList = res.data.tagEnumVoList;
      }
    },
    // 获取专项课程列表
    async getCourseList() {
      const res = await getCataloguesList(this.courseformdata);
      let couseArr = res.data.content;
      this.total = res.data.total;
      this.getFirstLevels();
      this.getGradeList();
      couseArr.map((item) => {
        // 每条数据的 tag 数组
        let tagsData = item.tags;
        tagsData.map((tagItem) => {
          // 把标签数组里面的内容 赋值给 对象属性上
          let tagId = tagItem.tagId,
            enumName = tagItem.enumName || tagItem.enumCode;
          if (item[tagId] !== undefined) {
            item[tagId] = item[tagId] + " " + enumName;
          } else {
            item[tagId] = "" + enumName;
          }
          if (tagId === 'xtfl') {
            item['enumCode'] = tagItem.enumCode;
          }
        });
      });
      this.courseList = couseArr;
    },
    // 获取获取推荐位列表
    async getAdLocations() {
      const res = await getAdLocations(this.adsformdata);
      this.adsList = res.data.content;
      this.total = res.data.total;
      this.getTerminalList();
    },
    // 获取获取终端列表
    async getTerminalList() {
      const res = await getTerminalList({ type: "ad_location_terminal" });
      this.terminalList = res.data;
    },
    // 获取书籍列表
    async getBookList () {
      let batch = { ...this.bookForm },
      params = {
        endTime: batch.endTime,
        name: batch.name,
        pageNum: this.bookPager.pageNum,
        pageSize: this.bookPager.pageSize,
        startTime: batch.startTime
      };
      if (batch.booktype) {
        params.tags = `booktype-${batch.booktype}`;
      }
      await getEntityBookList(params).then(data => {
        this.handleReqData(data.content);
        this.bookPager.total = data.total || 0;
      }).catch(() => {
        this.$message.error('获取目录列表请求异常');
      }).finally(() => {
        this.loading = false;
      });
    },
    handleReqData (data) {
      this.bookList = data || [];
      let wlength = 0;
      for (wlength in this.bookList) {
        let clength, cdata = this.bookList[wlength].tags;
        for (clength in cdata) {
          let lindd = this.bookList[wlength].tags[clength].tagId, sss = this.bookList[wlength][lindd];
          if (sss === undefined) {
            sss = '';
          }
          let enumName = cdata[clength].enumName || cdata[clength].enumCode,
            enmuCode = cdata[clength].enumCode;
          this.bookList[wlength][lindd] = sss + ' ' + enumName;
          this.bookList[wlength][`copy${lindd}`] = enmuCode;
        }
      }
    },
    // 选择业务链接
    selectThisLink(e) {
      let ywobj = {
        requestParam: e.requestParam,
        requestType: e.requestType,
        openType: e.openType,
      };
      let ywurl = "";
      if (e.requestParam != '') {
        if (e.url.indexOf("?") != -1) {
          ywurl = e.url + "&cuparam=" + JSON.stringify(ywobj);
        } else {
          ywurl = e.url + "?cuparam=" + JSON.stringify(ywobj);
        }
      } else {
        ywurl = e.url;
      }
      this.linkUrl = ywurl || "";
      this.dialogVisible = false;
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 2,
      });
    },
    // 选择自定义页面链接
    selectPageLink(e) {
      let subjectCode = '';
      if (e.tagValues && e.tagValues[1]) {
        subjectCode = e.tagValues[1].toString().substr(-4);
      }
      let pageurl = e.id + ".json" + "?type=" + e.type + "&alias=" + e.alias;
      this.dialogVisible = false;
      this.linkUrl = pageurl || "";
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 1,
        subjectCode: subjectCode
      });
    },
    // 选择学科产品
    selectCataLink(e) {
      let cataurl = JSON.stringify(e.appendixItem);
      this.dialogVisible = false;
      this.linkUrl = cataurl || "";
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 5,
        name: e.name,
        note: e.note,
        id: e.id,
        generalParam: e.appendixItem.generalParam,
        type: 'course',
        suitesId: e.id,
        goodsLabel: e.enumCode,
        fileUrlSmall: e.fileUrlSmall
      });
    },
    // 选择专项课程
    selectCourLink(e) {
      const obj = {
        bookId: e.id,
        isNew: "0",
        img: e.fileUrlSmall, // 专项课程的简介图
      };
      let requestobj = {
        requestParam: '{"screenMode": "1"}',
      };
      let courseUrl = "vcom-area://portal_url/nrmsui/resourceapl/student/courseDetail?item=" + JSON.stringify(obj) + "&cuparam=" + JSON.stringify(requestobj);
      this.dialogVisible = false;
      this.linkUrl = courseUrl || "";
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 3,
        name: e.name,
        note: e.note,
        id: e.id,
        generalParam: e.appendixItem.generalParam,
        courseNum: e["1396297940598822"],
        type: 'course',
        suitesId: e.id,
        goodsLabel: e.enumCode,
        fileUrlSmall: e.fileUrlSmall
      });
    },
    // 选择运营中心链接
    selectOperLink(e) {
      let operateUrl = e.code;
      this.dialogVisible = false;
      this.linkUrl = operateUrl || "";
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 4,
      });
    },
    // 选择书籍链接
    selecBookLink (e) {
      let bookUrl = "/mobparty/templateActiveRendering?id=" + e.id + "&type=book" + "&suitesId=" + e.id + "&goodsLabel="
      this.dialogVisible = false;
      this.linkUrl = bookUrl || "";
      this.$emit("selectThisLink", {
        url: this.linkUrl,
        index: this.theIndex,
        sectionIndex: this.sectionIndex,
        linktype: 6,
        id: e.id
      })
    },
    inputChange() {
      this.$emit("selectThisLink", {
        url: this.linkUrl,
      });
    },
    clearLink () {
      this.linkUrl = '';
      this.$emit("clearThisLink");
    }
  },
  created() {
    this.getLinkTypeList();
    this.linkUrl = this.linktypeurl;
  },
  watch: {
    linktypeurl(news, olds) {
      this.linkUrl = news;
    },
  },
};
</script>
<style lang="scss" scoped>
.select-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.linktext {
  display: flex;
  align-items: center;
}
.el-table tr {
  white-space: nowrap;
}
.linkcate {
  max-height: 80%;
  overflow: auto;
}
</style>
